:root {
  --card-radius: 6px;
  --card-gap: 12px;
  --card-bg: #ffffff;
  --text-dark: #111;
  --text-muted: #7a7a7a;
  --price-color: #000;
  --container-max: 1340px
}

html,
body {
  margin: 0;
  padding: 0;
  width: 100%;
  overflow-x: hidden
}

.sh-shoopy-html-page,
.sh-shoopy-html-page>div {
  width: 100%;
  margin: 0;
  padding: 0
}

.page-container,
.main-container,
body>main {
  width: 100%;
  margin: 0 auto
}

.page-container,
.main-container {
  padding-left: 16px;
  padding-right: 16px
}

@media (min-width:1024px) {

  .page-container,
  .main-container {
    max-width: var(--container-max);
    padding-left: 24px;
    padding-right: 24px
  }
}

.product-card-grid,
.product-listing-container {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--card-gap);
  width: 100%
}

@media (min-width:640px) {

  .product-card-grid,
  .product-listing-container {
    grid-template-columns: repeat(3, 1fr)
  }
}

@media (min-width:1024px) {

  .product-card-grid,
  .product-listing-container {
    grid-template-columns: repeat(4, 1fr)
  }
}

.product-card,
.sh-product-card {
  background: var(--card-bg);
  border-radius: var(--card-radius);
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
  border: none !important;
  box-shadow: none !important
}

.product-card-image-container {
  width: 100%;
  aspect-ratio: 4/5;
  background: #fff;
  position: relative;
  overflow: hidden
}

.product-card-image,
.pr-long-card .pr-image {
  width: 100%;
  height: 100%;
  object-fit: Contain;
  object-position: center
}

.product-card-info,
.product-card-price,
.__className_337041 {
  color: var(--text-dark)
}

.product-card-info h2,
.product-card-info .product-title {
  font-size: 14px;
  font-weight: 700;
  margin: 0;
  color: #222;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

.product-card-info .price {
  margin-top: 6px;
  font-size: 16px;
  font-weight: 900;
  color: #388e3c
}

.product-card .wishlist-button {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 28px;
  height: 28px;
  background: #fff;
  border-radius: 50%;
  z-index: 30
}

.main-image-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin: auto;
  background: #fff;
  overflow: hidden
}

.main-image-wrapper {
  max-width: 100%
}

@media (min-width:1200px) {
  .main-image-wrapper {
    max-width: 600px
  }
}

.main-image-wrapper img {
  width: 100%;
  height: auto;
  max-height: 80vh;
  object-fit: contain;
  border-radius: 8px
}

.product-detail-grid .image-gallery-container,
.product-detail-grid .image-gallery-container * {
  background-color: #ffffff !important
}

.banner,
.banner img,
.banner-collection,
.banner-collection img {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important
}

@media (min-width:769px) {

  .icon-button svg,
  .icon-button svg path,
  .utility-icons svg,
  .search-icon svg {
    stroke: #000 !important;
    fill: none !important
  }
}

@media (max-width:767px) {
  .main-header {
    justify-content: space-between
  }
}

.sh-shoopy-html-page .text-zinc-900,
.ref-widg.sh-referral-widget,
.woot-widget-powered-by {
  display: none !important
}

.woot-widget-bubble {
  position: fixed !important;
  bottom: 64px !important;
  right: 16px !important;
  z-index: 999999 !important
}

@media screen and (max-width:768px) {
  .woot-widget-holder {
    width: 80% !important;
    height: 60vh !important;
    bottom: 10px !important;
    right: 10px !important;
    transform: translateY(45%) !important
  }
}

}

.product-card-image-container {
  background: #fff !important
}

.product-card-image-container .product-card-image.main-image {
  background: #fff !important
}

.MuiModal-root main.MuiContainer-root {
  display: flex;
  flex-direction: column;
  padding: 0 !important;
  overflow: hidden
}

.MuiModal-root main.MuiContainer-root::before {
  content: "";
  display: block;
  width: 100%;
  aspect-ratio: 1600 / 677;
  background-image: url("https://image.cdn.shpy.in/516234/sinup-banner.1781698644839-1781698645121.jpeg");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  margin-bottom: 7px;
}

.MuiModal-root .flex.flex-col.items-center.py-6 {
  padding-top: 0 !important;
  padding-bottom: 10px !important;
  margin-top: 0 !important
}

.MuiModal-root h6,
.MuiModal-root .MuiTypography-h6 {
  margin-top: 5px !important;
  margin-bottom: 5px !important
}

.sh-shoopy-html-page>div {
  width: 100%;
  max-width: 100vw;
  overflow-x: hidden;
  border: none
}

.sh-shoopy-html-page .border-inherit {
  border: none
}

.sh-shoopy-html-page .text-zinc-900 {
  display: none !important
}

.border-inherit {
  border: none !important
}

.sh-shoopy-blog-page .border-inherit {
  border: none
}

.details-content h2 {
  font-size: 28px !important;
  font-weight: 700 !important;
  margin: 20px 0 15px !important;
  display: block !important
}

.details-content h3 {
  font-size: 22px !important;
  font-weight: 600 !important;
  margin: 20px 0 12px !important;
  display: block !important
}

.details-content p {
  margin: 0 0 15px !important;
  line-height: 1.7 !important;
  display: block !important
}

.details-content ul {
  padding-left: 20px !important;
  margin: 15px 0 !important;
  list-style: disc !important
}

.details-content ol {
  padding-left: 20px !important;
  margin: 15px 0 !important;
  list-style: decimal !important
}

.details-content li {
  margin-bottom: 8px !important
}

.details-content table {
  width: 100% !important;
  border-collapse: collapse !important;
  margin: 15px 0 !important
}

.details-content td,
.details-content th {
  border: 1px solid #ddd !important;
  padding: 10px !important
}

.details-content details {
  margin-bottom: 10px !important;
  border: 1px solid #ddd !important;
  border-radius: 6px !important;
  overflow: hidden !important
}

.details-content summary {
  padding: 12px 15px !important;
  cursor: pointer !important;
  font-weight: 600 !important;
  background: #f8f8f8 !important
}

.details-content details p {
  padding: 15px !important;
  margin: 0 !important
}

/* Hide on Desktop */

@media (min-width: 769px) {

  .desktop-nav.max-w-full {
    display: none !important;
  }

}

.hero-slider {
  position: relative;
  width: 100%;
  height: 70vh;
  overflow: hidden;
}


.slider-track {
  display: flex;
  height: 100%;
  transition: transform .5s ease;
  will-change: transform;
}


.slider-item {
  min-width: 100%;
  height: 100%;
}

.slider-item img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}


.slider-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(0, 0, 0, .35);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 18px;
  z-index: 10;
  backdrop-filter: blur(6px);
  transition: .3s;
}

.slider-arrow:hover {
  background: rgba(0, 0, 0, .65);
}

.slider-prev {
  left: 15px;
}

.slider-next {
  right: 15px;
}


.slider-dots {
  position: absolute;
  bottom: 15px;
  left: 0;
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 8px;
  z-index: 10;
}

.slider-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .5);
  cursor: pointer;
  transition: .3s;
}

.slider-dot.active {
  background: #fff;
  transform: scale(1.3);
}

@media(max-width:1024px) {

  .hero-slider {
    height: 60vh;
  }

}

@media(max-width:768px) {

  .hero-slider {
    height: auto;
    overflow: hidden;
  }

  .slider-item {
    height: auto;
  }

  .slider-item img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
  }

  .slider-arrow {
    display: none;
  }

  .slider-dots {
    bottom: 10px;
  }
}

@media(max-width:480px) {

  .slider-dot {
    width: 7px;
    height: 7px;
  }

}
.baba-wrap {
  max-width: auto;
  margin: 40px auto;
  padding: 0 15px;
}

.baba-desktop-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.baba-desktop-grid a,
.baba-mobile-grid a {
  display: block;
  text-decoration: none;
}

.baba-desktop-grid img,
.baba-mobile-grid img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 16px;
  transition: .3s;
}

.baba-desktop-grid img:hover,
.baba-mobile-grid img:hover {
  transform: scale(1.02);
}

/* MOBILE GRID */

.baba-mobile-grid {
  display: none;
}

/* MOBILE */

@media(max-width:768px) {

  .baba-desktop-grid {
    display: none;
  }

  .baba-mobile-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

}
.cat-wrapper{
    width:100%;
    background:#fff;
    padding:18px 0;
}

.cat-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin:0 15px 20px;
}

.cat-heading{
    font-size:20px;
    font-weight:700;
    color:#111827;
    letter-spacing:-0.5px;
}

.cat-view{
    text-decoration:none;
    font-size:14px;
    font-weight:600;
    color:#6d28d9;
}

.cat-grid{
    display:grid;
    grid-template-columns:repeat(10,1fr);
    gap:0;
    width:100%;
}

.cat-card{
    text-decoration:none;
    text-align:center;
    color:#000;
    transition:.3s ease;
}

.cat-img-wrapper{
    width:100%;
}

.cat-img-wrapper img{
    width:90%;
    aspect-ratio:1/1;
    object-fit:cover;
    border-radius:16px;
    display:block;
    margin:auto;
    transition:.3s ease;
}

.cat-card:hover img{
    transform:translateY(-4px);
}

.cat-title{
    margin-top:10px;
    font-size:12px;
    font-weight:700;
    color:#111;
}

/* Mobile */
@media(max-width:768px){

    .cat-header{
        margin:0 10px 15px;
    }

    .cat-heading{
        font-size:13px;
    }

    .cat-grid{
        display:flex;
        flex-wrap:nowrap;
        overflow-x:auto;
        overflow-y:hidden;
        scrollbar-width:none;
        -webkit-overflow-scrolling:touch;
        padding:0 5px;
    }

    .cat-grid::-webkit-scrollbar{
        display:none;
    }

    .cat-card{
        flex:0 0 auto;
        width:110px;
    }

    .cat-img-wrapper img{
        max-width:100px;
    }
}
.desktop-offers{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
    padding:10px;
}

.desktop-offers img{
    width:100%;
    height:auto;
    display:block;
    border-radius:10px;
}
.mobile-banner-slider{
    display:none;
}

@media (max-width:768px){

    .desktop-offers{
        display:none;
    }

    .mobile-banner-slider{
        display:block;
        width:100%;
        position:relative;
        overflow:hidden;
    }

    .banner-slide{
        position:absolute;
        inset:0;
        opacity:0;
        transition:opacity .8s ease-in-out;
        pointer-events:none;
    }

    .banner-slide.active{
        opacity:1;
        position:relative;
        z-index:2;
    }

    .banner-slide img{
        width:100%;
        height:auto;
        display:block;
        object-fit:contain; /* Original Aspect Ratio */
    }
}
.tulsi-wrap{
    width:100%;
    margin:30px auto;
    padding:0 15px;
}
.tulsi-desktop-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
}

.tulsi-desktop-grid a,
.tulsi-mobile-grid a{
    display:block;
    text-decoration:none;
}

.tulsi-desktop-grid img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    border-radius:12px;
    transition:.3s ease;
}

.tulsi-mobile-grid img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    border-radius:12px;
    transition:.3s ease;
}

.tulsi-desktop-grid img:hover,
.tulsi-mobile-grid img:hover{
    transform:scale(1.02);
}
.tulsi-mobile-grid{
    display:none;
}

@media(max-width:768px){

    .tulsi-desktop-grid{
        display:none;
    }

    .tulsi-mobile-grid{
        display:grid;
        grid-template-columns:repeat(2,1fr);
        gap:12px;
    }

}
.tulsi-heading{
    font-size:20px;
    font-weight:700;
    color:#111827;
    margin:0;
    line-height:1.2;
    letter-spacing:-0.5px;
}

@media (max-width:768px){
    .tulsi-heading{
        font-size:20px;
        font-weight:700;
        color:#111827;
        margin:0;
        line-height:1.2;
        letter-spacing:-0.5px;
    }
}
.jiva-collections{
    width:100%;
    padding:20px 15px;
    background:#fff;
}

.jiva-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:20px;
}

.jiva-heading{
    font-size:20px;
    font-weight:700;
    color:#111827;
    margin:0;
    line-height:1.2;
    letter-spacing:-0.5px;
}

.jiva-view{
    font-size:14px;
    font-weight:500;
    color:#111827;
    text-decoration:none;
    white-space:nowrap;
}

.jiva-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
}

.jiva-card{
    display:block;
    overflow:hidden;
    border-radius:16px;
    background:#f5f5f5;
    aspect-ratio:4/3;
    text-decoration:none;
}

.jiva-card img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    transition:transform .4s ease;
}

.jiva-card:hover img{
    transform:scale(1.04);
}
@media (max-width:768px){

    .jiva-grid{
        grid-template-columns:repeat(2,1fr);
        gap:10px;
    }

    .jiva-card{
        border-radius:12px;
    }

    .jiva-view{
        font-size:13px;
    }

}
.Ravindar-collections{
    width:100%;
    padding:20px 15px;
    background:#fff;
}

.Ravindar-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:20px;
}

.Ravindar-heading{
    font-size:20px;
    font-weight:700;
    color:#111827;
    margin:0;
    line-height:1.2;
    letter-spacing:-0.5px;
}

.Ravindar-view{
    font-size:14px;
    font-weight:500;
    color:#111827;
    text-decoration:none;
    white-space:nowrap;
}

.Ravindar-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
}

.Ravindar-card{
    display:block;
    overflow:hidden;
    border-radius:16px;
    background:#f5f5f5;
    text-decoration:none;
}

.Ravindar-card img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    transition:transform .4s ease;
}

.Ravindar-card:hover img{
    transform:scale(1.04);
}
@media (max-width:768px){

    .Ravindar-grid{
        grid-template-columns:repeat(2,1fr);
        gap:10px;
    }

    .Ravindar-card{
        border-radius:12px;
    }

    .Ravindar-view{
        font-size:13px;
    }

}
.chote-lal-collections{
    width:100%;
    padding:20px 15px;
    background:#fff;
}

.chote-lal-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:18px;
}

.chote-lal-heading{
    font-size:20px;
    font-weight:700;
    color:#111827;
    margin:0;
    line-height:1.2;
    letter-spacing:-0.3px;
}

.chote-lal-view{
    font-size:14px;
    font-weight:600;
    color:#111827;
    text-decoration:none;
    white-space:nowrap;
    transition:opacity .3s ease;
}

.chote-lal-view:hover{
    opacity:.7;
}

.chote-lal-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
}

.chote-lal-card{
    display:block;
    overflow:hidden;
    border-radius:18px;
    background:#f5f5f5;
    text-decoration:none;
    box-shadow:0 2px 10px rgba(0,0,0,.04);
}

.chote-lal-card img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    transition:transform .45s ease;
}

.chote-lal-card:hover img{
    transform:scale(1.05);
}
@media (max-width:991px){

    .chote-lal-grid{
        grid-template-columns:repeat(2,1fr);
        gap:12px;
    }

}
@media (max-width:768px){

    .chote-lal-collections{
        padding:16px 12px;
    }

    .chote-lal-heading{
        font-size:20px;
    }

    .chote-lal-view{
        font-size:13px;
    }

    .chote-lal-grid{
        grid-template-columns:repeat(2,1fr);
        gap:10px;
    }

    .chote-lal-card{
        border-radius:14px;
    }

}
.Bindu-collections{
    width:100%;
    padding:20px 15px;
    background:#fff;
}

.Bindu-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:18px;
}

.Bindu-heading{
    font-size:20px;
    font-weight:700;
    color:#111827;
    margin:0;
    line-height:1.2;
    letter-spacing:-0.3px;
}

.Bindu-view{
    font-size:14px;
    font-weight:600;
    color:#111827;
    text-decoration:none;
    white-space:nowrap;
    transition:opacity .3s ease;
}

.Bindu-view:hover{
    opacity:.7;
}

.Bindu-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
}

.Bindu-card{
    display:block;
    overflow:hidden;
    border-radius:18px;
    background:#f5f5f5;
    text-decoration:none;
    box-shadow:0 2px 10px rgba(0,0,0,.04);
}

.Bindu-card img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    transition:transform .45s ease;
}

.Bindu-card:hover img{
    transform:scale(1.05);
}
@media (max-width:991px){

    .Bindu-grid{
        grid-template-columns:repeat(2,1fr);
        gap:12px;
    }

}
@media (max-width:768px){

    .Bindu-collections{
        padding:16px 12px;
    }

    .Bindu-heading{
        font-size:20px;
    }

    .Bindu-view{
        font-size:13px;
    }

    .Bindu-grid{
        grid-template-columns:repeat(2,1fr);
        gap:10px;
    }

    .Bindu-card{
        border-radius:14px;
    }

}



